import 'package:flutter/material.dart';
import 'package:expandable/expandable.dart';
import 'package:flutter/animation.dart';
import 'package:demo1/view/home.dart';


class MyApp extends StatelessWidget {
  Widget titleSection = Container(
      padding: const EdgeInsets.all(32),
      child: Row(
        children: [
          Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    padding: const EdgeInsets.only(bottom: 8),
                    child: Text('尼古拉斯',
                        style:
                        TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
                  ),
                  Text('赵四', style: TextStyle(fontSize: 12, color: Colors.grey))
                ],
              )),
          LikeWidget(),
          // Icon(
          //   Icons.star,
          //   color: Colors.red,
          // ),
          // Text('99')
        ],
      ));

  Widget buttonSection = Container(
    padding: EdgeInsets.only(top: 10),
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: [
        _createButton(Colors.black, Icons.accessible, "八个坏"),
        _createButton(Colors.black, Icons.accessibility_new_outlined, "九个呆"),
        _createButton(Colors.black, Icons.account_circle_outlined, "没人爱"),
      ],
    ),
  );

  Widget textSection = Container(
      padding: EdgeInsets.only(bottom: 32, left: 32),
      child: ExpandablePanel(
        header: Text('简介'),
        collapsed: Text('我是什么?  点击展开全文'),
        expanded: AnimatedOpacity(
          child: Text(
              '我是一个傻子  im a totally fool in this world.  how dare you cursing me ?',
              maxLines: 3,
              softWrap: true),
          duration: Duration(seconds: 3),
          opacity: 1,
        ),
      ));

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '名人堂-大前门',
      home: Scaffold(
          appBar: AppBar(
            title: Text(
              '名人堂',
              style:
              TextStyle(color: Colors.black, fontWeight: FontWeight.w900),
            ),
            backgroundColor: Colors.amber[400],
          ),
          body: ListView(
            children: [
              SizedBox(
                width: 500,
                height: 350,
                child: MainScreen(),
              ),
              titleSection,
              textSection,
              ButtonWidget(),
              // buttonSection,
              // HeroAnimation(),
            ],
          )),
    );
  }
}

class ButtonWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.only(top: 10),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          _createButton(Colors.black, Icons.accessible, "八个坏", context),
          _createButton(Colors.black, Icons.accessibility_new_outlined, "九个呆", context),
          _createButton(Colors.black, Icons.account_circle_outlined, "没人爱", context),
        ],
      ),
    );
  }
}

class MainScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GestureDetector(
        onTap: () {
          Navigator.push(context, MaterialPageRoute(builder: (_) {
            return DetailScreen();
          }));
        },
        child: Image.asset(
          'images/2.png',
          width: 400,
          height: 350,
          fit: BoxFit.cover,
        ),
      ),
    );
  }
}

class DetailScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GestureDetector(
        onTap: () {
          Navigator.pop(context);
        },
        child: Center(
          child: Image.asset(
            'images/2.png',
            width: 400,
            height: 350,
            fit: BoxFit.cover,
          ),
        ),
      ),
    );
  }
}

Column _createButton(Color color, IconData icon, String text,[BuildContext context]) {
  return Column(
    mainAxisSize: MainAxisSize.min,
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      IconButton(
        icon: Icon(icon),
        onPressed: () {
          Navigator.push(context, MaterialPageRoute(builder: (_) {
            return HeroAnimation();
          }));
        },
      ),
      Container(
        margin: const EdgeInsets.only(top: 8),
        child: Text(
          text,
          style: TextStyle(
              fontSize: 12, fontWeight: FontWeight.w400, color: color),
        ),
      )
    ],
  );
}

class LikeWidget extends StatefulWidget {
  @override
  _LikeWidgetState createState() => _LikeWidgetState();
}

class _LikeWidgetState extends State<StatefulWidget> {
  bool _isLiked = true;
  int _likeCount = 100;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Container(
          child: IconButton(
            alignment: Alignment.centerRight,
            icon: (_isLiked ? Icon(Icons.star) : Icon(Icons.star_border)),
            color: Colors.red,
            onPressed: _toogleLike,
          ),
        ),
        SizedBox(
          width: 25,
          child: Container(
            child: Text('$_likeCount'),
          ),
        )
      ],
    );
  }

  void _toogleLike() {
    setState(() {
      if (_isLiked) {
        _isLiked = false;
        _likeCount -= 1;
      } else {
        _isLiked = true;
        _likeCount += 1;
      }
    });
  }
}